<template>
  <div class="text-sm">
    <table>
      <tr>
        <td class="w-200px h-30px">团队名称:</td>
        <td>{{ name }}</td>
      </tr>
      <tr>
        <td class="w-200px h-30px">团队简介:</td>
        <td>{{ formatDesc }}</td>
      </tr>
      <tr>
        <td class="w-200px h-30px">团队邀请码:</td>
        <td>{{ code }}</td>
      </tr>
      <tr>
        <td class="w-200px h-30px">团队操作:</td>
        <td>
          <!--          <div class="flex text-xs">-->
          <!--            <exit-group :leader-id="leaderId" :user-id="userId" :group-id="groupId"/>-->
          <!--            <div v-if="userId === leaderId">-->
          <!--              <dismiss-group :user-id="userId" :leader-id="leaderId" :group-id="groupId"/>-->
          <!--            </div>-->
          <!--          </div>-->
        </td>
      </tr>
    </table>
  </div>
</template>

<script lang="ts">
import {defineComponent} from "vue";

export default defineComponent({
  props: {
    leaderId: {
      type: Number,
      required: true
    },
    groupId: {
      type: Number,
      required: true
    },
    name: {
      type: String,
      required: true
    },
    desc: {
      type: String,
      required: true
    },
    code: {
      type: String,
      required: true
    }
  },
  setup(props) {
    const formatDesc = computed(() => {
      return props.desc ? props.desc : "--"
    })

    return {
      formatDesc
    }
  }
})

</script>

<style scoped>

</style>